<%@ page contentType="text/html; charset=UTF-8" language="java" %>
<%@ include file="include.jsp" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>


<link type="text/css" href="../css/ui-lightness/jquery-ui-1.7.2.custom.css" rel="stylesheet"/>
<script type="text/javascript" src="../js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="../js/jquery-ui-1.7.2.custom.min.js"></script>

<style type="text/css">
    .title {
        text-align: center;
        font-family: sans-serif;
        font-size: larger;
        color: #6699cc;
        width: 1000px;
        margin: 0 auto;
    }

    .grid {
        width: 1000px;
        margin: 0 auto;

    }

    .grid table {
        width: 100%;
    / / border-collapse : collapse;
        font-size: 12px;
        font-family: Verdana;

    }

    .table_head {
        font-size: medium;
        text-align: center;
        font-weight: bold;
        background-color: #6699cc;
    }

    tr {
        height: 25px;
    }

    .form {
        width: 1000px;
        margin: 0 auto;
        font-family: sans-serif;
        font-style: normal;

    }

    .form select {
        width: 300px;
        border: medium solid #FFFFFF;
        background-color: #e0e0e0;
    }

    .form input {
        width: 265px;
    }

    input.button {
        cursor: pointer;
        background-color: #FFCC00;
        font-weight: bold;
        width: 100px;

    }

    .form td {
        font-size: x-small;
        font-weight: bold;

    }

    .form table {

        border-collapse: collapse;
    }

    .required {
        color: red;
    }

    .active {
        background-color: #E1FFA7;
    }

    .inactive {
        background-color: #FFDDDC;
    }

    .table_row_1 {
        background-color: #e0e0e0;
    }

     .info_tr {
        height: 35px;
		background-color:#F0FFFF;
    }

	.head_tr{
		background-color:#FFA500;
		height: 20px;
		font-weight:bold;
		font-size:x-small;
	}	

</style>

<script type="text/javascript">

    $(document).ready(function() {

        $('#edit').click(function() {
            $('#dialog').dialog('open');
        })

        $("#dialog").dialog({
            bgiframe: true,
            autoOpen: false,
            height: 350,
            width:1200,
            modal: true,
            buttons: {
                'Отмена': function() {
                    $(this).dialog('close');
                },
                'Сохранить': function() {
                    $("#form").submit();
                }

            },
            close: function() {

            }

        });

    });

</script>

<div class="title">Карточка хоста ${host.hostName}</div>
<br>

<div class="grid">
    <fieldset>
        <table>
            <tr class="head_tr">
                <td>CPU Max</td>
                <td>CPU Model</td>
                <td>CPU Description</td>
            </tr>
            <tr class="info_tr">
                <td><c:out value="${hostCard.cpuMax}"/></td>
                <td><c:out value="${hostCard.cpuModel}"/></td>
                <td><c:out value="${hostCard.cpuDescription}"/></td>
            </tr>
            <tr class="head_tr">
                <td>RAM Max</td>
                <td>RAM Model</td>
                <td>RAM Description</td>
            </tr>
            <tr class="info_tr">
                <td><c:out value="${hostCard.ramMax}"/></td>
                <td><c:out value="${hostCard.ramModel}"/></td>
                <td><c:out value="${hostCard.ramDescription}"/></td>
            </tr>
            <tr class="head_tr">
                <td>HDD Max</td>
                <td>HDD Model</td>
                <td>HDD Description</td>
            </tr>
            <tr class="info_tr">
                <td><c:out value="${hostCard.hddMax}"/></td>
                <td><c:out value="${hostCard.hddModel}"/></td>
                <td><c:out value="${hostCard.hddDescription}"/></td>
            </tr>
            <tr class="head_tr">
                <td>Ethernet Max</td>
                <td>Ethernet Controller</td>
                <td></td>
            </tr>
            <tr class="info_tr">
                <td><c:out value="${hostCard.ethernetMax}"/></td>
                <td><c:out value="${hostCard.ethernetController}"/></td>
                <td></td>
            </tr>
            <tr class="head_tr">
                <td>Motherboard Model</td>
                <td></td>
                <td></td>
            </tr>
            <tr class="info_tr">
                <td><c:out value="${hostCard.motherboard}"/></td>
                <td></td>
                <td></td>
            </tr>
            <tr class="head_tr">
                <td>Raid</td>
                <td></td>
                <td></td>
            </tr>
            <tr class="info_tr">
                <td><c:out value="${hostCard.raidSupport}"/></td>
                <td></td>
                <td></td>
            </tr>
            <tr class="head_tr">
                <td>Power</td>
                <td></td>
                <td></td>
            </tr>
            <tr class="info_tr">
                <td><c:out value="${hostCard.power}"/></td>
                <td></td>
                <td></td>
            </tr>
            <tr class="head_tr">
                <td>Operation System</td>
                <td></td>
                <td></td>
            </tr>
            <tr class="info_tr">
                <td><c:out value="${hostCard.operationSystem}"/></td>
                <td></td>
                <td></td>
            </tr>


        </table>
    </fieldset>
</div>

<a href="#" id="edit">Редактировать</a>

<div class="messages">

    <c:if test="${requestScope.errorMessage ne null}">
        <c:out value="${requestScope.errorMessage}"/>
    </c:if>

</div>

<div class="form" id="dialog" style="display:none;">
    <form:form commandName="newHostCard" id="form" action="hostCard.htm?id=${host.hostId}">
        <fieldset>
            <table cellpadding="5" cellspacing="5">
                <tr>
                    <td>CPU Max</td>
                    <td><form:input path="cpuMax"/></td>
                    <td>CPU Model</td>
                    <td><form:input path="cpuModel"/></td>
                    <td>CPU Description</td>
                    <td><form:input path="cpuDescription"/></td>
                </tr>
                <tr>
                    <td>RAM Max</td>
                    <td><form:input path="ramMax"/></td>
                    <td>RAM Model</td>
                    <td><form:input path="ramModel"/></td>
                    <td>RAM Description</td>
                    <td><form:input path="ramDescription"/></td>
                </tr>
                <tr>
                    <td>HDD Max</td>
                    <td><form:input path="hddMax"/></td>
                    <td>HDD Model</td>
                    <td><form:input path="hddModel"/></td>
                    <td>HDD Description</td>
                    <td><form:input path="hddDescription"/></td>
                </tr>
                <tr>
                    <td>Ethrnet Max</td>
                    <td><form:input path="ethernetMax"/></td>
                    <td>Ethrnet Controller</td>
                    <td><form:input path="ethernetController"/></td>
                    <td>Motherboard</td>
                    <td><form:input path="motherboard"/></td>
                </tr>

                <tr>
                    <td>Raid Support</td>
                    <td><form:input path="raidSupport"/></td>
                    <td>Power</td>
                    <td><form:input path="power"/></td>
                    <td>Operation System</td>
                    <td><form:input path="operationSystem"/></td>
                </tr>
            </table>
        </fieldset>
    </form:form>
</div>